//@import '~antd/lib/style/themes/default.less';
@import '../../../utils/utils.less';
@import '../../../style/default.less';
:global {
  .zent-form__controls {
    text-align: left;
  }   
}
.right{
    :global{
      .zent-form__control-label{
        width:42px;
      }
    }
  }
.tabBar{
  text-align: left;  
  :global{
    .ant-tabs-extra-content{
      position: relative;
       &::before{
          content: '添加导航';
          position: absolute;
          top:-4px;
          left:-70px;
       }
    }
  }
}
.iconTypeActive{
  border-color: @primary !important; 
}
.active{
  position: relative;
  background:#fff !important;
  border-bottom: 1px solid #fff;
  border-radius: 4px 4px 0px 0px;
  &::after{
    content: '';
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 1px;
    background-color: #fff;
    border-bottom: 8px solid #fff;
    z-index: 2;
  }
}
.selectedIcon {
  width: 111px;
  height: 56px;
  background: rgba(250, 250, 250, 1);
  border: 1px dashed rgba(217, 217, 217, 1);
  opacity: 1;
  border-radius: 4px;
  text-align: center;
  line-height: 56px;
}

.icon-item {
  width: 112px;
  height: 56px;
  background: #fff;
  border: 1px solid rgba(168, 206, 255, 1);
  opacity: 1;
  border-radius: 4px;
  margin-bottom: 24px;
  margin-right: 24px;
  box-sizing: border-box;  
  cursor: pointer;
  &:hover {
    border-color: @primary-color;
  }
  & > .item {
    display: inline-block;
    width: 50%;
    height: 56px;
    box-sizing: border-box;
    position: relative;
    &.line {
      position: relative;
      &::before {
        content: '';
        width: 1px;
        height: 50%;
        position: absolute;
        top: 50%;
        right: 0;
        margin-top: -14px;
        border-right: 1px solid #e8e8e8;
      }
    }
    & > img {
      //width: 100%;
      width: 30px;
      height: 30px;
      vertical-align: top;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
    }
  }
  & .mask{
    display: none;
    position: absolute;
    top:1px;
    left: 1px;
    right: 1px;
    bottom: 1px;
    background-color: rgba(0, 0, 0, 0.45);
    color: #fff;
    text-align: center;
    line-height: 56px;
    border-radius: 4px;
  }
  &:hover .mask{
    display: block;
  }
}
